<template>
  <div class="GreetingCardPage">
    <HomePage v-if="pageName === 'HomePage'"></HomePage>
    <MinePage v-if="pageName === 'MinePage'"></MinePage>
    <TabBar ref="tabBar" :tabBarShow="tabBarShow"></TabBar>
    <wxCode ref="wxCode"></wxCode>

    <div class="pageLoad" v-if="pageLoadMsg.show">
      <div class="pageLoad1">
        <u-icon name="close" color="var(--main-color)" size="60"></u-icon>
        <p class="pageLoad2">{{ pageLoadMsg.text }}</p>
      </div>
    </div>
  </div>
</template>

<script>
import HomePage from './home.vue'
import MinePage from './mine.vue'
import TabBar from './tabBar.vue'
import wxCode from './wxCode.vue'
import $utils from '../../utils'

export default {
  components: {
    HomePage,
    MinePage,
    TabBar,
    wxCode,
  },
  data() {
    return {
      pageName: 'HomePage',
      pageLoadMsg: {
        text: '',
        show: false,
      },
      tabBarShow: true,
    }
  },
  onLoad(i) {
    if (i.pageName) {
      this.pageName = i.pageName
    }
  },
  created() {
    document.title = '积分兑换立减金'

    let title = '积分兑换立减金 v2022.01.010'
    if (!window.localStorage.APP_NAME) {
      window.localStorage.APP_NAME = title
    } else {
      if (window.localStorage.APP_NAME !== title) {
        window.localStorage.clear()
        setTimeout(() => {
          window.location.reload()
        }, 500)
      }
    }
  },
  mounted() {
    document.documentElement.style.setProperty('--main-color', '#DD4535')
    document.documentElement.style.setProperty('--main-bg', 'linear-gradient(180deg, #FAEAB3 0%, #E7C172 100%)')

    let activityId = $utils.urlQuery('activityId') || window.localStorage.activityId
    let custId = $utils.urlQuery('custId') || window.localStorage.custId

    if (activityId && custId) {
      window.localStorage.activityId = activityId
      window.localStorage.custId = custId
      this.pageSwich(sessionStorage.tabIndex || 0)
      this.pageLoad(false, '')
      this.$refs.wxCode.wxCodeSet()
    } else {
      this.pageLoad(true, '活动不存在')
    }
    this.$api.publicMobile.getSign({ url: location.href }).then((res) => {
      this.$refs.wxCode.wxShare(res.data)
    })
    window.localStorage.pointBal = $utils.urlQuery('pointBal') || window.localStorage.pointBal
  },
  methods: {
    pageLoad(i, j) {
      this.pageLoadMsg = {
        show: i,
        text: j,
      }
    },
    pageSwich(i) {
      if (i == 0) {
        this.pageName = 'HomePage'
      } else if (i == 1) {
        this.pageName = 'MinePage'
      }
    },
    pageSwichBtn(i) {
      this.$refs.tabBar.tabBtn(i)
    },
  },
}
</script>

<style scoped>
.GreetingCardPage {
  background: #f7f9fb;
  min-height: 100vh;
}
.pageLoad {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 600;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.pageLoad1 {
  background: #fff;
  border-radius: 16px;
  width: 610rpx;
  margin: 0 auto;
  padding: 100rpx 30rpx;
  border: 10rpx solid var(--main-color);
}
.pageLoad2 {
  color: #000;
  font-size: 34rpx;
  margin-top: 50rpx;
}
</style>
